<template>
	<view class="home">
		<view class="boxlist">
			<view class="boxitem">
				<view class="boxtext">
					设备编号：
				</view>
				<u--input clearable :disabled="disabled" placeholder="设备编号" border="bottom" v-model="name"></u--input>
			</view>
			<view class="boxitemxx">
				<view class="boxtext">
					<u-button @click="nubmoFn" type="warning" shape="circle" text="修改设备编号"></u-button>
				</view>
				<u--input clearable type="digit" placeholder="设备编号" border="bottom" v-model="nubmo"></u--input>
			</view>
			<view class="boxitem">
				<view class="boxtext">
					测站编号：
				</view>
				<u--input clearable type="number" placeholder="请输入数字" border="bottom" v-model="cezhan"></u--input>
			</view>
			<view class="boxitem">
				<view class="boxtext">
					经度：
				</view>
				<u--input clearable type="digit" placeholder="请输入内容" border="bottom" v-model="lon"></u--input>
			</view>
			<view class="boxitem">
				<view class="boxtext">
					纬度：
				</view>
				<u--input clearable type="digit" placeholder="请输入内容" border="bottom" v-model="lat"></u--input>
			</view>
			<view class="boxitem">
				<u-button @click="latlonFn" type="success" shape="circle" text="获取经纬度"></u-button>
			</view>
			<view class="boxitem">
				<view class="boxtext">
					水位修正值：
				</view>
				<u--input clearable type="digit" placeholder="请输入内容" border="bottom" v-model="xiuzheng"></u--input>
			</view>
			<view class="boxitem">
				<view class="boxtext">
					测站名称：
				</view>
				<u--input clearable placeholder="请输入汉字,最多8个" border="bottom" v-model="cezhanname"></u--input>
			</view>
			<!-- 			<view class="boxitem">
				<view class="boxtext">
					参数1：
				</view>
				<u--input :disabled="disabled" placeholder="预留" border="bottom" v-model="value1"></u--input>
			</view> -->
			<!-- 			<view class="boxitem">
				<view class="boxtext">
					参数2：
				</view>
				<u--input :disabled="disabled" placeholder="预留" border="bottom" v-model="value2"></u--input>
			</view> -->
			<view class="boxitem">
				<view class="boxtext">
					左坡角度：
				</view>
				<u--input clearable type="digit" placeholder="范围 10-99" border="bottom" v-model="lpo"></u--input>
			</view>
			<view class="boxitem">
				<view class="boxtext">
					右坡角度：
				</view>
				<u--input clearable type="digit" placeholder="范围 10-99" border="bottom" v-model="rpo"></u--input>
			</view>
			<!-- 			<view class="boxitem">
				<view class="boxtext">
					参数5：
				</view>
				<u--input :disabled="disabled" placeholder="预留" border="bottom" v-model="value5"></u--input>
			</view> -->
			<!-- 			<view class="boxitem">
				<view class="boxtext">
					参数6：
				</view>
				<u--input :disabled="disabled" placeholder="预留" border="bottom" v-model="value6"></u--input>
			</view> -->
			<view class="boxitem">
				<view class="boxtext">
					采集周期：
				</view>
				<u--input clearable type="digit" placeholder="范围 0-60000整数" border="bottom" v-model="cycle"></u--input>
			</view>
			<view class="boxitem">
				<view class="boxtext">
					底宽：
				</view>
				<u--input clearable type="digit" placeholder="范围 0-60000" border="bottom" v-model="bottomW"></u--input>
			</view>
			<!-- 按钮 -->
					<view class="" style="padding: 0 30rpx;">
						<view class="" style="margin: 10rpx;">
							<u-button @click="queryress" type="primary" shape="circle" text="查询数据"></u-button>
						</view>
			<!-- 			<view class="" style="margin: 10rpx;">
							<u-button @click="querydata" type="success" shape="circle" text="查询数据"></u-button>
						</view> -->
						<view class="" style="margin: 10rpx;">
							<u-button @click="modify" type="success" shape="circle" text="修改设备参数"></u-button>
						</view>
			<!-- 			<view class="" style="margin: 10rpx;">
							<u-button @click="aaa" type="warning" shape="reeor" text="测试"></u-button>
						</view> -->
					</view>
		</view>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				value: '0103480000033606d37790024d533032322e30303030005c716942000000000000000000000000000000000000000032322e303030303032322e30303030300000000000000000001655f009e8',
				aaaa: '011030000024480000000806D321A0024CFD403939392E39393939D5D4C1EAC6CCD5D4C1EAC6CCD5D4C1EA000000000000000033302E313233343533302E3233343536000000000000000000023039126E',
				nubmo:'',
				disabled: true,
				deviceId: '', //蓝牙
				serviceId: '', //蓝牙
				characteristicId: '', //蓝牙
				fff: '', //蓝牙
				name: '', //地址
				cezhan: '', //测站
				lon: '', //经度
				lat: '', //纬度
				xiuzheng: '', //水位修正值
				cezhanname: '', //测站名称
				value1: '', //参数1
				value2: '', //参数2
				lpo: '', //左坡角度
				rpo: '', //右坡角度
				value5: '', //参数5
				value6: '', //参数6
				cycle: '', //数据采集周期
				bottomW: '', //底宽
			}
		},
		onShow() {
			this.deviceId = this.vuex_deviceId
			this.getBLEDeviceServices()
		},
		onLoad(option) {
			uni.showLoading({
				mask:true,
				title: '获取服务中...'
			});
			setTimeout(()=>{
				uni.hideLoading()
			},5000)
		},
		methods: {
			// 测试
			aaa() {
				let resHex = this.value
				this.cezhan = this.hexToDecimal(resHex.substr(6, 8)) //测站编号
				this.lon = this.hexToDecimal(resHex.substr(14, 8)) / 1000000 //经度
				this.lat = this.hexToDecimal(resHex.substr(22, 8)) / 1000000 //纬度
				
				let xiuz = this.ascllFn(resHex.substr(30, 16))
				this.xiuzheng = this.hexToString(xiuz)//水位修正值
				
				this.cezhanname = this.hexToChinese(resHex.substr(46, 32)) //测站名称
				this.value1 = this.hexToDecimal(resHex.substr(78, 8)) //参数1
				this.value2 = this.hexToDecimal(resHex.substr(86, 8)) //参数2
				this.lpo = this.hexToString(resHex.substr(94, 16)) //左坡角度
				this.rpo = this.hexToString(resHex.substr(110, 16)) //右坡角度
				this.value5 = this.hexToDecimal(resHex.substr(126, 8)) //参数1
				this.value6 = this.hexToDecimal(resHex.substr(134, 8)) //参数1
				this.cycle = this.hexToDecimal(resHex.substr(142, 4)) //数据采集周期
				this.bottomW = this.hexToDecimal(resHex.substr(146, 4)) / 1000 //底宽
			},
			// 获取经纬度
			latlonFn(){
				uni.getLocation({
					type: 'wgs84',
					success:(res)=> {
						console.log('当前位置的经度：' + res.longitude);
						this.lon = res.longitude
						console.log('当前位置的纬度：' + res.latitude);
						this.lat = res.latitude
					}
				});

			},
			// 修改地址
			nubmoFn(){
				let nub = ['','06','ff','02','00','']
				nub[0] = this.decimalToHex(this.name * 1)
				let nubon =  this.decimalToHex(this.nubmo * 1)
				let nubif = nubon
				if (nubif.length < 2) {
					for (let i = 0; i < 2 - nubon.length; i++) {
						nubif = '0' + nubif
					}
				}
				console.log('nubif',nubif);
				nub[5] = nubif
				let str = ''
				for(let i = 0;i<nub.length;i++){
					str += nub[i]
				}
				let strcrc = str + this.crc16(str)[1] + this.crc16(str)[0]
				 let strarr = this.chunkStringByTwo(strcrc)
				
				let bleArr = this.ocstr(strarr)
				console.log('bleArr',bleArr);
				this.conbuffer(bleArr)
			},
			// 查询地址
			queryress() {
				let msg = ['0x00', '0x03', '0xFF', '0x02', '0x00', '0x01', '0x14', '0x0F']
				this.conbuffer(msg)
			},
			// 查询数据
			querydata() {
				let msg = ['', '03', '30', '00', '00', '24', '', '']
				msg[0] = this.decimalToHex(this.name * 1)
				let msgStr = ''
				for (let i = 0; i < msg.length - 2; i++) {
					msgStr = msgStr + msg[i]
				}
				let crcmsg = this.crc16(msgStr)
				let oxstr = msgStr + crcmsg[1] + crcmsg[0]
				let msgArr = this.chunkStringByTwo(oxstr)
				let bleArr = this.ocstr(msgArr)
				this.conbuffer(bleArr)
			},
			// 修改参数
			modify(data) {
				let str = '103000002448' //固定

				let cezhannub = this.decimalToHex(this.cezhan * 1) //测站编号
				let cezhanif = cezhannub
				if (cezhanif.length < 8) {
					for (let i = 0; i < 8 - cezhannub.length; i++) {
						cezhanif = '0' + cezhanif
					}
				}
				let cezhanA = cezhanif //测站编号

				let lonnub = this.decimalToHex(((this.lon * 1).toFixed(5)) * 1000000) //经度
				let lonif = lonnub
				if (lonif.length < 8) {
					for (let i = 0; i < 8 - lonnub.length; i++) {
						lonif = '0' + lonif
					}
				}
				let lonA = lonif //经度

				let latnub = this.decimalToHex(((this.lat * 1).toFixed(5)) * 1000000) //纬度
				let latif = latnub
				if (latif.length < 8) {
					for (let i = 0; i < 8 - latnub.length; i++) {
						latif = '0' + latif
					}
				}
				let latA = latif //纬度
				
				let xiuzhengnub = this.stringToHex((this.xiuzheng * 1).toFixed(4)) //水位修正值
				let xiuzhengif = xiuzhengnub
				if (xiuzhengif.length < 16) {
					for (let i = 0; i < 16 - xiuzhengnub.length; i++) {
						xiuzhengif += '0'
					}
				}
				let xiuzhengA = xiuzhengif //水位修正值

				let strnub = this.convertToHex(this.cezhanname) //测站名称
				if (strnub.length < 32) {
					let newstrnub = strnub
					for (let i = 0; i < 32 - strnub.length; i++) {
						newstrnub += '0'
					}
					strnub = newstrnub
				}
				let strnubA = strnub //测站名称

				let value1A = '00000000' //参数1
				let value2A = '00000000' //参数2

				let lponub = this.stringToHex((this.lpo * 1).toFixed(5)) //左坡角度
				let lpoif = lponub
				if (lpoif.length < 8) {
					for (let i = 0; i < 8 - lponub.length; i++) {
						lpoif += '0'
					}
				}
				let lpoA = lpoif //左坡角度

				let rponub = this.stringToHex((this.rpo * 1).toFixed(5)) //右坡角度
				let rpoif = rponub
				if (lpoif.length < 8) {
					for (let i = 0; i < 8 - rponub.length; i++) {
						rpoif += '0'
					}
				}
				let rpoA = lpoif //右坡角度

				let value5A = '00000000' //参数5
				let value6A = '00000000' //参数6

				let cyclenub = this.decimalToHex(Math.round(this.cycle * 1)) //数据采集周期
				let cycleif = cyclenub
				if (cycleif.length < 4) {
					for (let i = 0; i < 4 - cyclenub.length; i++) {
						cycleif = '0' + cycleif
					}
				}
				let cycleA = cycleif //数据采集周期

				let bottomWnub = this.decimalToHex(((this.bottomW * 1).toFixed(3)) * 1000) //底宽
				let bottomWif = bottomWnub
				if (bottomWif.length < 4) {
					for (let i = 0; i < 4 - bottomWnub.length; i++) {
						bottomWif = '0' + bottomWif
					}
				}
				let bottomWA = bottomWif //底宽

				let namenub = this.decimalToHex(Math.round(this.name * 1)) //设备地址
				let nameif = namenub
				if (nameif.length < 2) {
					for (let i = 0; i < 2 - namenub.length; i++) {
						nameif = '0' + nameif
					}
				}
				let nameA = nameif //数据采集周期

				let newstr = nameA + str //固定地址
				
				let objAll = newstr + cezhanA + lonA + latA + xiuzhengA + strnubA + value1A + value2A + lpoA + rpoA +
					value5A + value6A + cycleA + bottomWA
					console.log('objAll',objAll,objAll.length);
					
					let objARR = objAll + this.crc16(objAll)[1] + this.crc16(objAll)[0]
				
				let crcstyArr = this.chunkStringByTwo(objARR)
				for(let i = 0;i<crcstyArr.length;i++){
					crcstyArr[i] = '0x' + crcstyArr[i]
				}
				
				console.log('crcstyArr', crcstyArr,crcstyArr.length);
				this.conbuffer(crcstyArr)
			},

			//监听消息变化
			listenValueChange(data) {
				let resHex = data
				setTimeout(() => {
					uni.onBLECharacteristicValueChange(res => {
						console.log('RES', res)
						let resHex = this.ab2hex(res.value)
						console.log('监听初始化数据', resHex, resHex.length);
						// 广播获取地址
						if (resHex.length == 14) {
							let str = resHex.substr(8, 2)
							this.name = this.hexToDecimal(str)
							setTimeout(()=>{
								this.querydata()
							},200)
						}
						if(resHex.length == 16 && resHex.substr(2, 2) == '06'){
							uni.showToast({
								title: '地址设置成功',
								duration: 1500
							});

						}
						if(resHex.length == 16 && resHex.substr(2, 4) == '1030'){
							uni.showToast({
								title: '参数设置成功',
								duration: 1500
							});

						}
						if (resHex.length == 154 && resHex.substr(2, 2) == '03') {
							this.cezhan = this.hexToDecimal(resHex.substr(6, 8)) //测站编号
							this.lon = this.hexToDecimal(resHex.substr(14, 8)) / 1000000 //经度
							this.lat = this.hexToDecimal(resHex.substr(22, 8)) / 1000000 //纬度
							
							let shuiweiMO = this.ascllFn(resHex.substr(30, 16)) //水位修正值
							this.xiuzheng = this.hexToString(shuiweiMO) 
							
							this.cezhanname = this.hexToChinese(resHex.substr(46, 32)) //测站名称
							this.value1 = this.hexToDecimal(resHex.substr(78, 8)) //参数1
							this.value2 = this.hexToDecimal(resHex.substr(86, 8)) //参数2
							
							
							let lpoMO = this.ascllFn(resHex.substr(94, 16)) //左坡角度
							this.lpo = this.hexToString(lpoMO) 
							
							
							let rpoMO = this.ascllFn(resHex.substr(110, 16)) //右坡角度
							this.rpo = this.hexToString(rpoMO) //右坡角度
							
							
							this.value5 = this.hexToDecimal(resHex.substr(126, 8)) //参数1
							this.value6 = this.hexToDecimal(resHex.substr(134, 8)) //参数1
							this.cycle = this.hexToDecimal(resHex.substr(142, 4)) //数据采集周期
							this.bottomW = this.hexToDecimal(resHex.substr(146, 4)) / 1000 //底宽
						}
					})
				}, 300)
			},
			//给每个数组添加0x
			ocstr(data) {
				let arr = []
				for (let i = 0; i < data.length; i++) {
					data[i] = '0x' + data[i]
				}
				return data
			},
			// 每2个字符串为一个元素数组
			chunkStringByTwo(str) {
				const result = [];
				for (let i = 0; i < str.length; i += 2) {
					result.push(str.slice(i, i + 2));
				}
				return result;
			},
			// 处理ASCLL 30 -00
			ascllFn(data){
				let str = data + ''
				let arr = this.chunkStringByTwo(str)
				console.log('arr',arr);
				for(let i = 0;i<arr.length;i++){
					if(arr[i] == '00'){
						arr[i] = '30'
					}
				}
				let arrnew =  arr
				console.log('arrnew',arrnew);
				let strnre = ''
				for(let i = 0;i<arrnew.length;i++){
					strnre += arrnew[i]
				}
				return strnre
			},
			// CRC16校验
			crc16(dataHexString) {
				const dataBytes = [];
				for (let i = 0; i < dataHexString.length; i += 2) {
					dataBytes.push(parseInt(dataHexString.substr(i, 2), 16));
				}

				let crc = 0xFFFF;
				const polynomial = 0xA001;

				for (const byte of dataBytes) {
					crc ^= byte;
					for (let i = 0; i < 8; i++) {
						if (crc & 0x0001) {
							crc = ((crc >> 1) ^ polynomial) & 0xFFFF;
						} else {
							crc >>= 1;
						}
					}
				}
				let crcstr = crc.toString(16).toUpperCase();
				if (crcstr.length % 2 == 0) {
					let result = crcstr.match(/.{1,2}/g)
					return result;
				} else {
					let str = '0' + crcstr
					let result = str.match(/.{1,2}/g)
					return result;
				}
			},
			// 16进制转10进制
			hexToDecimal(hex) {
				return parseInt(hex, 16);
			},
			// 10进制转16进制
			decimalToHex(data) {
				let decimal = data * 1
				let hex = decimal.toString(16).toUpperCase();
				if (hex.length % 2 !== 0) {
					return '0' + hex
				} else {
					return hex
				}
				// return decimal.toString(16).toUpperCase();
			},
			// 16进制转字符串 ASCII码
			hexToString(hex) {
				let str = '';
				for (let i = 0; i < hex.length; i += 2) {
					let charCode = parseInt(hex.substr(i, 2), 16);
					str += String.fromCharCode(charCode);
				}
				return str;
			},

			//字符串转16进制
			stringToHex(data) {
				let str = data + ''
				return str.split('').map(function(char) {
					return char.charCodeAt(0).toString(16).padStart(2, '0');
				}).join('');
			},
			// 16进制转汉字
			hexToChinese(hex) {
				var str = '';
				for (var i = 0; i < hex.length / 4; i++) {
					var codePoint = parseInt(hex.substr(i * 4, 4), 16); // 获取每四位的十六进制值并转换成十进制
					str += String.fromCharCode(codePoint); // 根据Unicode编码生成对应的字符
				}
				return str;
			},
			// 汉字转16进制
			convertToHex(str) {
				let result = '';
				for (let i = 0; i < str.length; i++) {
					result += str.charCodeAt(i).toString(16);
				}
				return result;
			},
			// ArrayBuffer转16进度字符串示例
			ab2hex(buffer) {
				const hexArr = Array.prototype.map.call(
					new Uint8Array(buffer),
					function(bit) {
						return ('00' + bit.toString(16)).slice(-2)
					}
				)
				return hexArr.join('')
			},
			// 输入蓝牙数据
			conbuffer(data) {
				let msg = data
				// 向蓝牙设备发送一个0x00的16进制数据
				const buffer = new ArrayBuffer(msg.length)
				const dataView = new DataView(buffer)
				// dataView.setUint8(0, 0)
				for (var i = 0; i < msg.length; i++) {
					// dataView.setUint8(i, msg.charAt(i).charCodeAt())
					dataView.setUint8(i, msg[i]);
				}
				this.sendMsgToKey(buffer)
			},
			/* 向设备发送消息(分包发送，单包20字节，递归发送)
			 */
			sendMsgToKey(buffer) {
				var that = this //vue中的this
				const packageSize = 20 //分包大小
				if (buffer.byteLength <= 20) { //如果小于20直接发送，不再继续调用
					uni.writeBLECharacteristicValue({
						// 这里的 deviceId 需要在上面的 getBluetoothDevices 或 onBluetoothDeviceFound 接口中获取
						deviceId: that.deviceId,
						// 这里的 serviceId 需要在上面的 getBLEDeviceServices 接口中获取
						serviceId: that.serviceId,
						// 这里的 characteristicId 需要在上面的 getBLEDeviceCharacteristics 接口中获取
						characteristicId: that.fff, //第二步写入的特征值
						// 这里的value是ArrayBuffer类型
						value: buffer,
						writeType: 'write',
						success: (res) => {
							//此时设备已接收到你写入的数据
							console.log('写入111');

						},
						fail: (err) => {
							console.log('传输失败', err)
						},
						complete: function() {}
					})
				} else { //如果大于20发送完成后继续递归调用
					var newData = buffer.slice(20)
					var writeBuffer = buffer.slice(0, 20)
					uni.writeBLECharacteristicValue({
						// 这里的 deviceId 需要在上面的 getBluetoothDevices 或 onBluetoothDeviceFound 接口中获取
						deviceId: that.deviceId,
						// 这里的 serviceId 需要在上面的 getBLEDeviceServices 接口中获取
						serviceId: that.serviceId,
						// 这里的 characteristicId 需要在上面的 getBLEDeviceCharacteristics 接口中获取
						characteristicId: that.fff, //第二步写入的特征值
						// 这里的value是ArrayBuffer类型
						value: writeBuffer,
						writeType: 'write',
						success: function(res) {
							console.log('写入222');
							//写入后继续递归调用发送剩下的数据
							setTimeout(() => {
								that.sendMsgToKey(newData)
							}, 100)
						},
						fail: (err) => {
							console.log('传输失败', err)
						},
						complete: function() {}
					})
				}
			},
			//获取蓝牙的所有服务
			getBLEDeviceServices() {
				setTimeout(() => {
					uni.getBLEDeviceServices({
						// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
						deviceId: this.vuex_deviceId,
						success: (res) => {
							console.log('获取蓝牙所有服务', res);
							//E95D93AF-251D-470A-A062-FA1922DFA9A8
							//6E400001-B5A3-F393-E0A9-E50E24DCCA9E
							res.services.forEach((item) => {

								if (item.uuid.indexOf("0000FFF0") != -1) {
									this.serviceId = item.uuid;

									//获取特征
									this.getBLEDeviceCharacteristics()
								}
								if (item.uuid.indexOf("0000FFE0") != -1) {
									this.serviceId = item.uuid;

									//获取特征
									this.getBLEDeviceCharacteristics()
								}
							})
						}
					})
				}, 1000)
			},
			//获取蓝牙特征
			getBLEDeviceCharacteristics() {
				console.log('获取蓝牙特征值');
				setTimeout(() => {
					uni.getBLEDeviceCharacteristics({
						// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
						deviceId: this.deviceId,
						// 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
						serviceId: this.serviceId,
						success: (res) => {

							this.characteristics = res.characteristics
							res.characteristics.forEach((item) => {

								if (item.uuid.indexOf("FFF2") != -1) {
									this.fff = item.uuid

								}
								if (item.uuid.indexOf("FFE1") != -1) {
									this.fff = item.uuid

								}
								if (item.uuid.indexOf("0000FFE1") != -1) {

									this.characteristicId = item.uuid
									//利用传参的形势传给下面的notify，这里的uuid如果都需要用到，就不用做判断了，建议使用setTimeout进行间隔性的调用此方法
									this.notifyBLECharacteristicValueChange(item.uuid)
								}
								if (item.uuid.indexOf("0000FFF1") != -1) {

									this.characteristicId = item.uuid


									//利用传参的形势传给下面的notify，这里的uuid如果都需要用到，就不用做判断了，建议使用setTimeout进行间隔性的调用此方法
									this.notifyBLECharacteristicValueChange(item.uuid)
								}
							})
						},
						fail: (res) => {
							console.log(res)
						}
					})
				}, 1000)
			},
			// 启用 notify 功能
			notifyBLECharacteristicValueChange(characteristicId) {
				console.log('启用 notify 功能');
				uni.notifyBLECharacteristicValueChange({
					state: true, // 启用 notify 功能
					// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
					deviceId: this.deviceId,

					// 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
					serviceId: this.serviceId,
					// 这里的 characteristicId 需要在 getBLEDeviceCharacteristics 接口中获取
					characteristicId: this.characteristicId,
					success: (res) => {
						console.log('蓝牙名字', res);
						// vuex
						// uni.$u.vuex('vuex_devicename', this.vuexlist.name)
						uni.hideLoading()
						this.listenValueChange()
						// uni.showToast({
						// 	title: '服务已开启',
						// 	icon: 'success',
						// 	mask: true,
						// 	duration: 1000
						// });
						// uni.hideToast();
						// setTimeout(() => {
						// 	this.query()
						// }, 300)
						console.log('蓝牙服务已开启');
					},
					fail: (res) => {
						uni.hideLoading()
						uni.showToast({
							title: '获取服务失败',
							icon: 'fail',
							mask: true,
							duration: 1000
						});

					}
				})

			},
		}
	}
</script>
<style scoped lang="scss">
	.boxlist {
		padding: 30rpx;

		.boxitem {
			padding: 8rpx 20rpx;
			border-radius: 20rpx;
			margin-bottom: 10rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			background-color: #ffffff;
			box-shadow: 0rpx 0rpx 5rpx 5rpx #ebebeb;

			.boxtext {
				width: 220rpx;
				text-align: justify;
				text-align-last: justify;
			}
		}
		.boxitemxx {
			padding: 8rpx 20rpx;
			border-radius: 20rpx;
			margin-bottom: 10rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			background-color: #ffffff;
			box-shadow: 0rpx 0rpx 5rpx 5rpx #ebebeb;

			.boxtext {
				width: 300rpx;
				margin-right: 30rpx;
			}
		}
	}
</style>
<style>
	page {
		background-color: #f8f8f8;
	}
</style>